<template>
    <div>
        <navigationBar :bgType="3" :backType="2" :navigationTitle="title" />
        <view class="content">
            <view class="card">
                <view class="title f-28"> 真实姓名 </view>
                <input
                    class="f-28"
                    type="text"
                    placeholder="请输入真实姓名"
                    v-model="ali.name"
                />
            </view>
            <view class="card">
                <view class="title f-28"> 支付宝账号 </view>
                <input
                    class="f-28"
                    type="text"
                    placeholder="请输入支付宝账号"
                    v-model="ali.mobile"
                />
            </view>
            <view class="card">
                <view class="title f-28"> 身份证号 </view>
                <input
                    class="f-28"
                    type="idcard"
                    placeholder="请输入身份证号"
                    v-model="ali.idcard"
                />
            </view>
        </view>

        <view class="btns f-30" @click="submit"> 保存 </view>
    </div>
</template>
<script>
import { editAlipayInfo } from "@/API/API/recruit.js";
export default {
    data() {
        return {
            ali: {
                name: "",
                mobile: "",
                idcard: "",
                title: "提现",
            },
        };
    },

    onLoad(options) {
        this.ali = JSON.parse(options.info)
            ? JSON.parse(options.info)
            : {
                  name: "",
                  mobile: "",
                  idcard: "",
              };
        if (options.type) {
            this.title = "支付宝账号信息";
        }
    },

    methods: {
        submit() {
            if (!this.ali.name) {
                uni.showToast({
                    title: "请输入真实姓名",
                    icon: "none",
                });
                return;
            }
            if (!this.ali.mobile) {
                uni.showToast({
                    title: "请输入支付宝账号",
                    icon: "none",
                });
                return;
            }
            if (!this.ali.idcard) {
                uni.showToast({
                    title: "请输入身份证号",
                    icon: "none",
                });
                return;
            }
            editAlipayInfo({
                zfb_name: this.ali.name,
                zfb_mobile: this.ali.mobile,
                zfb_idcard: this.ali.idcard,
            })
                .then((res) => {
                    uni.showToast({
                        title: res.msg,
                        icon: "none",
                    });
                    setTimeout(() => {
                        uni.navigateBack();
                    }, 800);
                })
                .catch((err) => {
                    uni.showToast({
                        title: err.msg,
                        icon: "none",
                    });
                });
        },
    },
};
</script>
<style lang="scss" scoped>
.content {
    padding: 20rpx;
    .card {
        padding: 28rpx 25rpx;
        background-color: white;
        border-radius: 20rpx;
        margin-bottom: 20rpx;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .title {
            color: $title-color;
        }
        .title::before {
            content: "*";
            color: red;
            margin-right: 10rpx;
        }
        input {
            text-align: right;
        }
    }
}
.btns {
    width: 586rpx;
    height: 82rpx;
    line-height: 82rpx;
    text-align: center;
    margin: 60rpx auto 0;
    color: white;
    background: $grad-theme-color;
    border-radius: 40rpx;
}
</style>